@import '../../../../common';

:host {
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.form {
  display: flex;
  flex-direction: row;
  margin: 10px 10px 0 10px;

  [nz-button] {
    margin-left: 5px;

    &.active {
      color: $cds_color_green;
      border-color: $cds_color_green;

      :host-context(.night) & {
        border-color: $darkTheme_green;
        color: $darkTheme_green;
      }
    }
  }
}

nz-checkbox-group {
  display: flex;
  flex-direction: column;
}

.content {
  padding: 10px;
  flex: 1;
  overflow-y: auto;

  .ko {
    color: $darkTheme_red;
  }

  .skipped {
    color: $darkTheme_orange;
  }

  .ok {
    color: $darkTheme_green;
  }
}

.tree-node-header {
  height: 26px;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0 5px;
  cursor: pointer;
  user-select: none;
  text-decoration: node;
  color: inherit;
  overflow: hidden;

  &.large {
    height: 32px;

    .name {
      line-height: 32px;
    }
  }

  .name {
    flex: 1;
    padding: 0 5px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    line-height: 26px;

    [nz-icon] {
      margin-right: 5px;
    }
  }

  .time {
    margin-left: 20px;
    color: rgba(0, 0, 0, .45);

    :host-context(.night) & {
      color: rgba(255, 255, 255, 0.45);
    }
  }

  &:hover {
    background-color: #f5f5f5;

    :host-context(.night) & {
      background-color: rgba(255, 255, 255, 0.08);
    }
  }
}

.tree-node-content {
  display: flex;
  flex-direction: column;
  margin-left: 10px;
  border-left: 2px dotted #f5f5f5;

  :host-context(.night) & {
    border-color: rgba(255, 255, 255, 0.08);
  }

  &:has(~ .tree-node-header) {
    margin-bottom: 3px;
  }

  &.large {
    &:has(~ .tree-node-header) {
      margin-bottom: 5px;
    }
  }
}